<!Doctype html>
<html>
<head>
    <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1">
    <title>商品详情</title>
    <link rel="stylesheet" type="text/css" href="../css/common.css"/>
    <link rel="stylesheet" type="text/css" href="../css/main.css"/>
    <link rel='stylesheet' type='text/css' href="../css/style.css"/>
    <link rel='stylesheet' href="../css/showBook.css" type='text/css'/>
    <script type="text/javascript" src="../js/modernizr.min.js"></script>
    <!-- <script type="text/javascript" src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script> -->
    <script src="../js/jquery-1.11.0.min.js"></script>
    <!--引入工具 获取请求链接中的参数-->
    <script src="../js/getParameter.js"></script>

    <script type="application/x-javascript">
        /* addEventListener("load", function () {
         setTimeout(hideURLbar, 0);
     }, false);*/

        function hideURLbar() {
            window.scrollTo(0, 1);
        }
    </script>
    <!-- <script src="js/jquery.easydropdown.js"></script> -->
    <link rel="stylesheet" href="../css/etalage.css">

    <script src="../js/jquery.etalage.min.js"></script>
    <script>
        $(function () {
            $("#header").load("header.html");
            $("#left").load("left.html");
        });

    </script>
    <script>
        $(function () {
            $("#header").load("header.html");
            $("#left").load("left.html");
        });
    </script>
    <script>
        $(function () {
            $('#show_img').etalage({
                thumb_image_width: 300,
                thumb_image_height: 400,
                zoom_area_width: 300,
                zoom_area_height: 300,
                show_hint: true
            });
            //验证数量
            var count = $("#count");
            var reg = /^\+?[1-9][0-9]*$/;
            //表单失焦之后  触发这个验证事件
            count.blur(function () {
                if (!reg.test(count.val())) {
                    alert("请输入正整数！");
                }
            });
            // 获取bid
            var bid = getParameter("bid");
            // 发送请求
            $.get("../book/getBookByBid.do", {bid: bid}, function (data) {
                $("#bid").val(data.bid);
                $("#p_bookName").text(data.bookName);
                $("#p_content").text(data.content);
                $("#span_price").text("价格：￥" + data.price);
                $("#p_author").text("作者：" + data.author);
                $("#p_publishing").text("出版社：" + data.publishing);
                $("#p_pubTime").text("出版时间：" + data.pubTime);
                //图片信息
                // var imgs = $(".img_view");
                // var path = "../book/download?img=" + data.bigImg;
                // alert(path);
                // for (let i = 0; i < imgs.length; i++) {
                // alert(i);
                // $(imgs[i]).attr("src", path);
                // }
                //更改类名为img_view的image标签的src属性值
                $(".img_view").attr("src", "../book/download?img=" + data.bigImg);
                // loadImg();
            });

            //购买  ../order/shoppingPay.do
            $("#pay_form").submit(function () {
                if (confirm("是否购买？")) {
                    $.post("../order/directlyPay.do", $(this).serialize(), function (data) {
                        //提示处理结果
                        alert(data.errorInfo);
                        if (data.errorType == 0) {
                            //购买成功  重新加载页面
                            location.reload();
                        } else if (data.errorType == 1) {
                            //未登录  跳转登录页面
                            location.href = "../user/login.do";
                        } else if (data.errorType == 2) {
                            //购买失败  跳转到主页
                            location.href = "../static/index.html";
                        }
                    });
                }
                //取消原有的表单数据提交
                return false;
            });

            //添加购物车
            $("#jg_btn").click(function (){
                if (confirm("是否加入购物车？")) {
                    $.post("../shoppingCart/addCart.do", {bid: bid,count:count.val()}, function (data) {
                        alert(data.errorInfo);
                        if (data.errorType == 0) {
                            //加购成功  重新加载页面
                            location.reload();
                        } else if (data.errorType == 1) {
                            //未登录  跳转登录
                            location.href = "../user/login.do";
                        }
                    });
                }
            });
        });


    </script>

</head>
<body>
<div class="container clearfix">
    <div id="header"></div>
    <div id="left"></div>
    <div class="singel_right">
        <div class="labout span_1_of_a1">
            <!-- start product_slider -->
            <ul id="show_img">
                <li>
                    <!--                    <img class="etalage_thumb_image img_view" src="" />
                                        <img class="etalage_thumb_image img_view" src="" />-->
                    <img class="img_view" style="width: 300px;height: 400px" src="" alt="">
                </li>
            </ul>
            <!-- end product_slider -->
        </div>
        <div class="cont1 span_2_of_a1">
            <form id="pay_form" action="" method="post">
                <input type="text" hidden id="bid" name="bid"/>
                <h1 id="p_bookName">BookName</h1>
                <div class="price_single">
                    <span class="actual" id="span_price">￥42.00</span>
                </div>
                <h2 class="quick">简介:</h2>
                <p class="quick_desc" id="p_content"> Test Text</p>
                <p class="quick_desc" id="p_author">作者:</p>
                <p class="quick_desc" id="p_publishing">出版社:</p>
                <p class="quick_desc" id="p_pubTime">出版时间:</p>
                <ul class="product-qty">
                    <span>数量：<input type="text" id="count" style="width: 30px;" name="count"/></span>
                </ul>
                <div class="btn_form">
                    <input type="submit" value="购买" class="btn btn-info">
                    <input type="button" value="加入购物车" onclick="" class="btn btn-info" id="jg_btn">
                </div>
            </form>
        </div>
        <div class="clearfix"></div>
    </div>
</div>
</body>
</html>